<template>
  <div class="decorate-cityMain diyWrap">
    <diy-tpl :tplData="tplData" :itemPic="itemPic"></diy-tpl>
    <section class="modulePadding" style="padding-top:5px;padding-bottom:5px;">
      <section class="fulltext j-fulltext" v-html="description"></section>
    </section>
  </div>
</template>

<script>
  import Vue from 'vue'
  import { getGroup } from '@/api/item/item'
  import diyTpl from '@/components/diyTpl/index'
  import { openPage } from '@/utils/utils'
  export default Vue.extend({
    name: 'index',
    components: {
      diyTpl
    },
    data() {
      return {
        height: window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight,
        tplData: [],
        description: '',
        itemPic: '',
        is_display_original_price: '1',
        smallQuery: {}
      }
    },
    created() {
    },
    mounted() {
      // TODO 小程序触底加载更多
      window.addEventListener('reachbottom', () => {
        window.$$publish('groupReachBottom', true)
      })
      window.addEventListener('wxload', (query) => {
        // console.log('监听页面参数-wxload', query)
        // console.log('监听页面参数-route', this.$route.query)
        this.smallQuery = Object.assign(this.$route.query, query)
        // console.log('this.smallQuery11', this.smallQuery)
        this.getGroupFun()

      })
    },
    methods: {
      getGroupFun() {
        const data = {
          id: this.smallQuery.id
        }
        getGroup(data).then(res => {
          // TODO 返回链接则进行跳转
          if (res.data && res.data.redirect_url) {
            openPage(res.data.redirect_url, 1)
          } else if (res.status == 1) {
              wx.setNavigationBarTitle({
                title: res.data.page_title
              })
            this.tplData = res.data._diyHtml
            this.description = res.data.description
            this.itemPic = res.data.itemPic
            this.is_display_original_price = res.data.is_display_original_price
            if (this.tplData.length < 10) {
              this.finished = true
            }
            // TODO小程序如果第一页加载没有满屏 则继续加载
              if (!this.finished) {
                this.$nextTick(() => {
                  document.querySelector('.diyWrap').$$getBoundingClientRect().then(res=>{
                    if (res.height*1 < this.height*1) {
                      window.$$publish('groupReachBottom', true)
                    }
                  })
                })
              }
          }
        })
      }
    }
  })
</script>

<style lang="scss">
.decorate-cityMain{
	margin: 0 20px;
}
</style>
